<section id="widget-grid" class="">
    <div class="row">
        <article class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
        <div class="widget-body">
            <!-- Dynamic Modal -->
            <div class="modal fade" id="changeModal" tabindex="-1" role="dialog" aria-labelledby="changeModalLabel" aria-hidden="true">
                <div class="modal-dialog">
                    <div class="modal-content">
                    </div>
                </div>
            </div>
            <a href="javascript:void(0);" id="start"  class="btn btn-success" onclick="startUpsql()">启动</a>
            <a href="javascript:void(0);" id="stop"  class="btn btn-danger" onclick="stopUpsql()">停止</a>
            <a href="javascript:void(0);" id="backup"  class="btn btn-primary" onclick="backupUpsql()">备份</a>
            <a href="javascript:void(0);" id="delete"  class="btn btn-danger" onclick="deleteUpsql()">删除</a>
            <a href="javascript:void(0);" id="change"  class="btn btn-success" onclick="changeUpsql()">变更</a>
            <a href="javascript:void(0);" id="changeversion"  class="btn btn-info" onclick="changeUpsqlVersion()">版本变更</a>
            <a href="javascript:void(0);" id="export"  class="btn btn-primary" onclick="exportUpsql()">导出</a>
            <a href="javascript:void(0);" id="rebuild"  class="btn btn-danger" onclick="rebuildUpsql()">重建</a>
            <a href="javascript:void(0);" id="manage"  class="btn btn-primary" onclick="manageUpsql()">管理</a>
        </div>
            <p>
                &nbsp;
            </p>
        </article>
    </div>
    <div class="row">
    	<div id="list-alert">
        </div>
    </div>
    <div class="row">
        <article class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
            <!-- Widget ID (each widget will need unique ID)-->

            <!-- end widget -->
            <table id="jqgrid"></table>
            <div id="pjqgrid"></div>
        </article>

    </div>
    <div class="modal fade" id="serviceModal" tabindex="-1" role="dialog" aria-labelledby="serviceModalLabel" aria-hidden="true">
        <div class="modal-dialog" style="width: 800px;" id="dialogmodal">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                        &times;
                    </button>
                    <h4 class="modal-title" id="serviceModalLabel">
                        任务状态提示
                    </h4>
                </div>
                <div class="modal-body">
                    <div class="table-responsive">
                        <table class="table table-bordered">
                            <thead>
                            <tr>
                                <th>所属者</th>
                                <th>操作时间</th>
                                <th>对象类型</th>
                                <th>对象名称</th>
                                <th>任务类型</th>
                                <th>状态</th>
                                <th width="30%">回执信息</th>
                            </tr>
                            </thead>
                            <tbody id="mainframestate">
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭
                    </button>
                </div>
            </div><!-- /.modal-content -->
        </div><!-- /.modal -->
    </div>
</section>
<script>
    function startUpsql(){
    	ListAlertClear();
    	var id=$("#start");
    	var s = $("#jqgrid").jqGrid('getGridParam', 'selarrrow');
    	if(s.length==1){
            var obj_id = $("#jqgrid").jqGrid('getRowData',s).id;
   		 	ListConfirm('start', obj_id);
        }
        else{
        	ListAlert("请勾选一行数据");
        }
    }
    
    function stopUpsql(){
    	ListAlertClear();
    	var id=$("#stop");
    	var s = $("#jqgrid").jqGrid('getGridParam', 'selarrrow');
    	if(s.length==1){
            var obj_id = $("#jqgrid").jqGrid('getRowData',s).id;
   		 	ListConfirm('stop', obj_id);
        }
        else{
        	ListAlert("请勾选一行数据");
        }
    }
    
    function deleteUpsql(){
    	ListAlertClear();
    	var id=$("#delete");
    	var s = $("#jqgrid").jqGrid('getGridParam', 'selarrrow');
    	if(s.length==1){
            var obj_id = $("#jqgrid").jqGrid('getRowData',s).id;
   		 	ListConfirm('delete', obj_id);
        }
        else{
        	ListAlert("请勾选一行数据");
        }
    }
    
    function backupUpsql(){
    	ListAlertClear();
    	var id=$("#backup");
    	var s = $("#jqgrid").jqGrid('getGridParam', 'selarrrow');
    	if(s.length==1){
            var obj_id = $("#jqgrid").jqGrid('getRowData',s).id;
   		 	ListConfirm('backup', obj_id);
        }
        else{
        	ListAlert("请勾选一行数据");
        }
    }
    
    function rebuildUpsql(){
    	ListAlertClear();
    	var id=$("#rebuild");
    	var s = $("#jqgrid").jqGrid('getGridParam', 'selarrrow');
    	if(s.length==1){
            var obj_id = $("#jqgrid").jqGrid('getRowData',s).id;
   		 	ListConfirm('rebuild', obj_id);
        }
        else{
        	ListAlert("请勾选一行数据");
        }
    }
    
    function changeUpsql(){
    	ListAlertClear();
    	var id=$("#change");
    	var s = $("#jqgrid").jqGrid('getGridParam', 'selarrrow');
        if(s.length==1){
            id.attr("href","views/service/mysql/change.html");
            id.attr("data-toggle","modal");
            id.attr("data-target","#changeModal");
        } else{
        	ListAlert("请勾选一行数据");
            id.removeAttr("data-toggle");
            id.removeAttr("data-target");
            id.removeAttr("href");
        }
    }
    
    function changeUpsqlVersion(){
    	ListAlertClear();
    	var id=$("#changeversion");
    	var s = $("#jqgrid").jqGrid('getGridParam', 'selarrrow');
        if(s.length==1){
            id.attr("href","views/service/mysql/changeVersion.html");
            id.attr("data-toggle","modal");
            id.attr("data-target","#changeModal");
        } else{
        	ListAlert("请勾选一行数据");
            id.removeAttr("data-toggle");
            id.removeAttr("data-target");
            id.removeAttr("href");
        }
    }
    
    function manageUpsql(){
        var id=$("#manage");
        s = $("#jqgrid").jqGrid('getGridParam', 'selarrrow');
        if(s.length==1){
        	var obj_id = $("#jqgrid").jqGrid('getRowData',s).id;
        	setSession('serviceUpsqlId', obj_id);
            id.attr("href","index.html#views/service/mysql/manage.html");
        } else{
        	ListAlert("请勾选一行数据");
            id.removeAttr("href");
        }
    }
    pageSetUp();
    loadScript("js/plugin/jqgrid/grid.locale-en.min.js", function(){
    	loadScript("js/plugin/jqgrid/jquery.jqGrid.min.js", function(){
    		loadScript("js/create-jqgrid.js", function(){
    			sendGet("/upm_manager/v1.0/servs?site="+getSession("siteId")+'&serv_type=mysql',createGrid_mysql_list,ListAlert,null);
    		});
    	});
    });
    
    $('#serviceModal').on("show.bs.modal", function(e){
    	ListAlertClear();
    	$("#mainframestate").empty();
    	sendGet("/upm_manager/v1.0tasks?obj_id="+$(e.relatedTarget).data('serviceId'),createGrid_serviceDetail,ListAlert,null);
    });
    
    function confirm(type, id){
    	switch(type){
    	case 'start':
    		sendPut("/upm_manager/v1.0/servs/"+id+"/start",showReturn,ListAlert,null, null);
    		break;
    	case 'stop':
    		sendPut("/upm_manager/v1.0/servs/"+id+"/stop",showReturn,ListAlert,null, null);
    		break;
    	case 'delete':
    		sendDelete("/upm_manager/v1.0/servs/"+id, showReturn, ListAlert, null ,null);
    		break;
    	case 'rebuild':
    		sendPut("/upm_manager/v1.0/servs/"+id+"/rebuild",showReturn,ListAlert,null, null);
    		break;
    	case 'backup':
    		sendPut("/upm_manager/v1.0/servs/"+id+"/backup",showReturn,ListAlert,null, null);
    		break;
    	default:
    	}
    }
    
    //下载
    function exportUpsql(){
    	var $eleForm = $("<form method='post'></form>");
        $eleForm.attr("action","/upm_manager/v1.0/servs/download?site="+getSession("siteId")+'&serv_type=mysql');
        $(document.body).append($eleForm);
        $eleForm.submit();
    }    
    
    function showReturn(){
    	sendGet("/upm_manager/v1.0/servs?site="+getSession("siteId")+'&serv_type=mysql',reloadGrid,ListAlert,null);
	}
    function reloadGrid(data){
    	ListAlertClear();
    	var jq_data=data['data'];   	
    	$("#jqgrid").clearGridData().setGridParam({data:jq_data}).trigger("reloadGrid");
    }
    
	clearInterval(flag);
	var flag = setInterval(showReturn, setTime);
</script>